<section id="dashboard-view" class="mainbar">
    <br />
    <div class="layout layout-row layout-wrap" layout="row" layout-align="space-around center">
        <md-card ng-repeat="Section in vm.UserSections" class="dashboardCard" ng-click="vm.SectionClick(Section.Category)">
            <md-toolbar md-theme-watch class="layout" md-theme="{{vm.colors}}">
                <md-card-content>
                    <md-card-content>
                        <div layout="column" layout-align="space-around center" flex="100">
                            <div style="width:100%; margin-top:5px;" layout="row" layout-align="space-around center">
                                <div class="cardBadge1 RedBadge"><span>{{Section.StatRequests}}</span></div>
                                <div class="cardBadge1 GreenBadge"><span>{{Section.Outstanding}}</span></div>
                            </div><br />
                            <p class="cardHeader">{{Section.Category}}</p>
                        </div>

                        
                        <!--<div class="cardBadge">{{Section.Outstanding}}</div>
                        <div class="statBadge" ng-if="Section.StatRequests > 0">{{Section.StatRequests}}</div>-->
                    </md-card-content>
                </md-card-content>
            </md-toolbar>
        </md-card>
    </div>
    <br /><br />
    <div class="layout layout-wrap statsview" layout="column" layout-align="space-between center" flex="100">
        <div class="layout layout-row layout-wrap" layout="row" layout-align="space-around center">
            <h2>Statistics</h2>
        </div>
        <div class="layout layout-row layout-wrap" layout="row" layout-align="space-around center">
            <div id="WeeklyStats"></div>

            <div class="chartblock">
                <br />
                <md-select ng-model="vm.PracticeStat" ng-change="vm.PracticeRadioChange(vm.PracticeStat)">
                    <md-option value="0">Today</md-option>
                    <md-option value="1">Yesterday</md-option>
                    <md-option value="2">Current Week</md-option>
                    <md-option value="3">Current Month</md-option>
                    <md-option value="4">Previous Month</md-option>
                </md-select>

                <div id="DailyStats" />
            </div>
        </div>
        <div class="layout layout-row layout-wrap" layout="row" layout-align="space-around center">
            <div class="chartblock">
                <md-select ng-model="vm.RefInStat" ng-change="vm.RefInRadioChange(vm.RefInStat)">
                    <md-option value="0">Today</md-option>
                    <md-option value="1">Yesterday</md-option>
                    <md-option value="2">Current Week</md-option>
                    <md-option value="3">Current Month</md-option>
                    <md-option value="4">Previous Month</md-option>
                </md-select>
                <div id="RefInStats" />
            </div>

            <div class="chartblock">
                <md-select ng-model="vm.RefOutStat" ng-change="vm.RefOutRadioChange(vm.RefOutStat)">
                    <md-option value="0">Today</md-option>
                    <md-option value="1">Yesterday</md-option>
                    <md-option value="2">Current Week</md-option>
                    <md-option value="3">Current Month</md-option>
                    <md-option value="4">Previous Month</md-option>
                </md-select>
                <div id="RefOutStats" />
            </div>
        </div>
    </div>
</section>